<script lang="tsx" setup>
import { authBinding } from '@/service/api/social/auth';
import { useAuthStore } from '@/store/modules/auth';

defineOptions({
  name: 'ThirdParty'
});
const authStore = useAuthStore();

const authUrl = async (source: string) => {
  const { data, error } = await authBinding(source, authStore.userInfo.company.tenantId);
  if (!error) {
    window.location.href = data?.data;
  } else {
    (window as any).$message.error(data?.msg);
  }
  // .then((res: any) => {
  //   if (res.code === 200) {
  //     window.location.href = res.data;
  //   } else {
  //     // proxy?.$modal.msgError(res.msg);
  //   }
  // });
};
</script>

<template>
  <div class="p-24px">
    <div>
      <div class="font-width-500 font-size-18px">第三方绑定</div>
      <div class="mt-8px font-size-12px text-gray-400">绑定后将同步第三方平台的组织架构和成员</div>
    </div>
    <div class="mt-20px">
      <NList>
        <NListItem>
          <div class="flex justify-between flex-items-center">
            <div class="flex flex-gap-10px">
              <div>
                <SvgIcon local-icon="gitee" class="font-size-40px" />
              </div>
              <div>
                <div class="font-size-14px">GITEE</div>
                <div class="font-size-12px text-gray-500">
                  GTEE
                  <Na>「Smart Tools 微信 企业绑定过程指导」</Na>
                </div>
              </div>
            </div>
            <div>
              <NButton type="primary" @click="authUrl('gitee')">绑定</NButton>
            </div>
          </div>
        </NListItem>
        <NListItem>
          <div class="flex justify-between flex-items-center">
            <div class="flex flex-gap-10px">
              <div>
                <SvgIcon local-icon="wechat" class="font-size-40px" />
              </div>
              <div>
                <div class="font-size-14px">微信</div>
                <div class="font-size-12px text-gray-500">
                  绑定后将同步微信企业的组织架构和成员，并发送钉钉消息。请参考
                  <Na>「Smart Tools 微信 企业绑定过程指导」</Na>
                </div>
              </div>
            </div>
            <div>
              <NButton type="primary">绑定</NButton>
            </div>
          </div>
        </NListItem>
        <NListItem>
          <div class="flex justify-between flex-items-center">
            <div class="flex flex-gap-10px">
              <div>
                <SvgIcon local-icon="feishu" class="font-size-40px" />
              </div>
              <div>
                <div class="font-size-14px">飞书</div>
                <div class="font-size-12px text-gray-500">
                  绑定后将同步微信企业的组织架构和成员，并发送钉钉消息。请参考
                  <Na>「Smart Tools 微信 企业绑定过程指导」</Na>
                </div>
              </div>
            </div>
            <div>
              <NButton type="primary">绑定</NButton>
            </div>
          </div>
        </NListItem>
      </NList>
    </div>
  </div>
</template>

<style lang="scss" scoped>
::v-deep(.smart-thing-avatar) {
  display: flex;
  align-items: center;
}
</style>
